<!DOCTYPE html>
<html>

<!--包含头部-->
{include file='head'}


<section class="rt_wrap content mCustomScrollbar">
    <div class="rt_content">
        <div class="page_title">
            <h2 class="fl">添加新权限</h2>
        </div>

        <!--添加会员的信息-->
        <ul class="ulColumn2">

            <li>
                <span class="item_name" style="width:120px;">权限名称：</span>
                <input type="text" class="textbox textbox_225"  placeholder="权限名称..." name="rule" maxlength="10"/>
                <span class="tips"></span>
            </li>

            <li>
                <span class="item_name" style="width:120px;">权限路由：</span>
                <input type="text" class="textbox textbox_225"  placeholder="路由..." name="url" maxlength="30"/>
                <span class="tips"></span>
            </li>
            <li>
                <span class="item_name" style="width:120px;">权限条件：</span>
                <input type="text" class="textbox textbox_225"  placeholder="条件..." name="where" maxlength="30"/>
                <span class="tips"></span>
            </li>

            <li>
                <span class="item_name" style="width:120px;"></span>
                <input type="button" class="link_btn" value="添加" name="btn"/>
            </li>
        </ul>
    </div>
</section>
</body>
</html>
<script>

    //提交数据
    $(function () {

        var $oName = null;
        var $oUrl  = null;
        var $oWhere = null;

        var fName = false;
        var fUrl  = false;
        var fWhere = false;

        //权限名
        $('[name=rule]').blur(function () {

            $oName = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
            //console.log($oName);
            //格式是否合法
            if ($oName.length <= 0 || $oName.length > 10) {

                $('.tips').eq(0).addClass('errorTips').html('权限名长度应在1~10位字符(含汉字)').css('color','red');
                fName = false;
                return false;
            }

            fName = true;
            $('.tips').eq(0).addClass('errorTips').html('权限名合法').css('color','green');

            if (fName) {

                //ajax
                $.post('username',{username:$oName},success,'json');
            }


        });

        //权限路由
        $('[name=url]').blur(function () {

            $oUrl = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
            //console.log($oUrl);

            //格式是否合法
            if ($oUrl.length <= 0  ||  $oUrl.length > 30) {

                $('.tips').eq(1).addClass('errorTips').html('路由必须在1~30位字符').css('color','red');
                fUrl = false;
                return false;
            }

            fUrl = true;
            $('.tips').eq(1).addClass('errorTips').html('权限路由合法').css('color','green');
            if (fUrl) {

                //ajax
                $.post('route', {route: $oUrl}, success, 'json');
            }
        });

        //权限条件
        $('[name=where]').blur(function () {

            $oWhere = $(this).val().replace(/(^\s*)|(\s*$)/g, "");
            //console.log($oWhere);
            //格式是否合法
            if ($oWhere.length > 30) {

                $('.tips').eq(2).addClass('errorTips').html('条件必须在30位字符之内').css('color','red');
                fWhere = false;
                return false;
            }

            fWhere = true;
            $('.tips').eq(2).addClass('errorTips').html('条件合法').css('color','green');

        });

        //按钮提交
        $('[name=btn]').click(function () {

            if (fName && fUrl) {

                console.log($oName, $oUrl , $oWhere);

                //ajax
                $.post('add',{username:$oName, url:$oUrl, where:$oWhere},success,'json');
            }
        });


        //回调函数
        function success(data)
        {
            console.log(data);
            switch (data.state) {
                //存在,不合法
                case 1:
                    $('.tips').eq(0).addClass('errorTips').html(data.tip).css('color','red');
                    fName = false;
                    break;
                //不存在,合法
                case 2:
                    $('.tips').eq(0).addClass('errorTips').html(data.tip).css('color','green');
                    break;
                //存在,不合法
                case 3:
                    $('.tips').eq(1).addClass('errorTips').html(data.tip).css('color','red');
                    fUrl = false;
                    break;
                //不存在,合法
                case 4:
                    $('.tips').eq(1).addClass('errorTips').html(data.tip).css('color','green');
                    break;
                //添加成功
                case 5:
                    alert(data.tip);
                    //重载当前页面
                    window.location.reload();
                    break;
                //添加失败
                case 6:
                    alert(data.tip);
                    break;
            }
        }

    });

</script>
